{extend name="public:base"/}


{block name="title"}新增商品{/block}

{block name="style"}
<link href="__STATIC__/admin/plugin/my_uploader/css/uploads.css" rel="stylesheet">
{/block}

{block name="main"}

<section class="content" xmlns="http://www.w3.org/1999/html">
    <div class="row">

        <div class="col-md-12">

            <div class="row">
                <div class="col-lg-12">
                    <div class="box">
                        <div class="box-header with-border m-b-sm">
                            <h3 class="box-title">新增商品</h3>
                        </div>

                        <div class="col-sm-12">
                            <div class="nav-tabs-custom">
                                <ul class="nav nav-tabs">
                                    <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true" class="text">基本信息</a></li>

                                    <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false" class="voice">商品描述</a></li>

                                    <li class=""><a data-toggle="tab" href="#tab-3" aria-expanded="false" class="image">商品相册</a></li>

                                    <li class=""><a data-toggle="tab" href="#tab-4" aria-expanded="false" class="news">商品模型</a></li>
                                    <li class=""><a data-toggle="tab" href="#tab-5" aria-expanded="false" class="video">积分抵扣</a></li>
                                </ul>

                                <form id="pt_form" method="post">
                                <div class="tab-content  m-t-md">
                                    <div id="tab-1" class="tab-pane active">
                                            <div class="panel-body">
                                                <div class="form-group required">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="goods_name" class="control-label Validform_label" >商品名称</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="goods_name" class="form-control" name="goods_name" placeholder="请输入商品名称" datatype="s2-120" errormsg="商品名称超出长度范围">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="goods_remark" class="control-label Validform_label" >商品简介</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="goods_remark" class="form-control" name="goods_remark" placeholder="请输入商品简介" datatype="s2-255" ignore="ignore"  errormsg="商品简介超出长度范围">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="goods_sn" class="control-label Validform_label" >商品货号</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="goods_sn" class="form-control" name="goods_sn" placeholder="请输入商品货号" datatype="s2-60" ignore="ignore"  errormsg="商品货号超出长度范围">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group required">
                                                    <div class='col-sm-2 text-right'>
                                                        <label class="control-label" for="cat_id">商品分类</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <select id="cat_id" class="form-control" name="cat_id">
                                                            <option value="0">选择分类</option>
                                                            <?php if(!empty($category)){foreach($category as $k=>$v){?>
                                                            <option value="<?=$v['id']?>"><?=str_repeat('|------',$v['lev'])?><?=$v['name']?></option>
                                                            <?php }} ?>
                                                        </select>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label class="control-label" for="brand_id">商品品牌</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <select id="brand_id" class="form-control" name="brand_id">
                                                            <option value="0">请选择品牌</option>
                                                            <?php if(!empty($brand)){foreach($brand as $k=>$v){?>
                                                            <option value="<?=$v['id']?>"><?=$v['name']?></option>
                                                            <?php }} ?>
                                                        </select>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label class="control-label" for="suppliers_id">供货商</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <select id="suppliers_id" class="form-control" name="suppliers_id">
                                                            <option value="0">请选择供货商</option>
                                                            <?php if(!empty($suppliers)){foreach($suppliers as $k=>$v){?>
                                                            <option  value="<?=$v['suppliers_id']?>"><?=$v['suppliers_name']?></option>
                                                            <?php }} ?>
                                                        </select>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group required">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="shop_price" class="control-label Validform_label" >本店售价</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="shop_price" class="form-control" name="shop_price" placeholder="请输入本店售价" datatype="n" ignore="ignore" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group required">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="market_price" class="control-label Validform_label" >市场价</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="market_price" class="form-control" name="market_price" placeholder="请输入市场价" datatype="n" ignore="ignore" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="cost_price" class="control-label Validform_label" >成本价</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="cost_price" class="form-control" name="cost_price" placeholder="请输入成本价" ignore="ignore" datatype="n" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="store_count" class="control-label Validform_label" >总库存</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="store_count" class="form-control" name="store_count" placeholder="请输入总库存" datatype="n" ignore="ignore"  errormsg="库存数量是数字类型" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group required">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="original_img" class="control-label Validform_label" >商品缩略图</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <div class="test">
                                                            <div class="up-button" id="select-img">选择图片</div>
                                                            <div class="img-list" id="img-list">
                                                                <!--图片列表样例-->
                                                                <div class="img-item">
                                                                    <img src="__STATIC__/admin/plugin/my_uploader/images/defalut.jpg">
                                                                    <input type="hidden" />
                                                                    <em class="delete" onclick="uploader.del_list(this)">×</em>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="form-group " >
                                                    <div class="col-sm-2 text-right">
                                                        <label class="control-label Validform_label">是否包邮                                        </label>
                                                    </div>

                                                    <div class="col-sm-10">
                                                        <div>

                                                            <span style="color:#636f7a"><input type="radio" name="is_free_shipping" value="0" datatype="*"  nullmsg="请选择是否包邮" checked="checked">否</span>


                                                            <span style="color:#636f7a"><input type="radio" name="is_free_shipping" value="1" >是</span>

                                                        </div>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>


                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="weight" class="control-label Validform_label" >商品重量</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="weight" class="form-control" name="weight" placeholder="请输入商品重量" datatype="n" ignore="ignore"  errormsg="商品重量克为单位是数字类型" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="keywords" class="control-label Validform_label" >商品关键词</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="keywords" class="form-control" name="keywords" placeholder="请输入商品关键词" datatype="s2-255" ignore="ignore"  errormsg="商品关键词超出长度范围">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group required" >
                                                    <div class="col-sm-2 text-right">
                                                        <label class="control-label Validform_label">是否上架                                        </label>
                                                    </div>

                                                    <div class="col-sm-10">
                                                        <div>

                                                            <span style="color:#636f7a"><input type="radio" name="is_on_sale" value="0" datatype="*"  nullmsg="请选择是否上架" checked="checked">否</span>


                                                            <span style="color:#636f7a"><input type="radio" name="is_on_sale" value="1" >是</span>

                                                        </div>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>


                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="sort" class="control-label Validform_label" >商品排序</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="sort" class="form-control" name="sort" placeholder="请输入商品排序" datatype="n" ignore="ignore"  errormsg="商品排序是数字类型" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group " >
                                                    <div class="col-sm-2 text-right">
                                                        <label class="control-label Validform_label">是否推荐                                        </label>
                                                    </div>

                                                    <div class="col-sm-10">
                                                        <div>

                                                            <span style="color:#636f7a"><input type="radio" name="is_recommend" value="0" datatype="*"  nullmsg="请选择是否推荐" checked="checked">否</span>


                                                            <span style="color:#636f7a"><input type="radio" name="is_recommend" value="1" >是</span>

                                                        </div>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>


                                                <div class="form-group " >
                                                    <div class="col-sm-2 text-right">
                                                        <label class="control-label Validform_label">是否新品                                        </label>
                                                    </div>

                                                    <div class="col-sm-10">
                                                        <div>

                                                            <span style="color:#636f7a"><input type="radio" name="is_new" value="0" datatype="*"  nullmsg="请选择是否新品" checked="checked">否</span>


                                                            <span style="color:#636f7a"><input type="radio" name="is_new" value="1" >是</span>

                                                        </div>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>


                                                <div class="form-group " >
                                                    <div class="col-sm-2 text-right">
                                                        <label class="control-label Validform_label">是否热卖                                        </label>
                                                    </div>

                                                    <div class="col-sm-10">
                                                        <div>

                                                            <span style="color:#636f7a"><input type="radio" name="is_hot" value="0" datatype="*"  nullmsg="请选择是否热卖" checked="checked">否</span>


                                                            <span style="color:#636f7a"><input type="radio" name="is_hot" value="1" >是</span>

                                                        </div>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    <div id="tab-2" class="tab-pane">
                                        <div class="panel-body">
                                            <div class="form-group required">
                                                <div class='col-sm-1 text-right'>
                                                    <label for="goods_content" class="control-label Validform_label" >商品描述</label>
                                                </div>
                                                <div class='col-sm-11'>
                                                    <textarea style="height:600px;" id="goods_content"></textarea>
                                                    <div class="help-block"></div>

                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                    <div id="tab-3" class="tab-pane">
                                        <div class="panel-body">
                                            <div class="form-group required">
                                                <div class='col-sm-1 text-right'>
                                                    <label for="original_img" class="control-label Validform_label" >商品相册</label>
                                                </div>
                                                <div class='col-sm-11'>
                                                    <div class="test">
                                                        <div class="up-button" id="select-imgs">选择图片</div>
                                                        <div class="img-list" id="img-lists">
                                                            <!--图片列表样例-->
                                                            <div class="img-item">
                                                                <img src="__STATIC__/admin/plugin/my_uploader/images/defalut.jpg">
                                                                <input type="hidden" name="imgs[]" />
                                                                <em class="delete" onclick="uploader.del_list(this)">×</em>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div id="tab-4" class="tab-pane">
                                            <div class="panel-body" style="padding:0;">
                                                <div class="form-group">
                                                    <div class='col-sm-2 text-right'>
                                                        <label class="control-label" for="goods_type">商品所属模型</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <select id="goods_type" class="form-control" name="goods_type">
                                                            <option value="0">请选择商品模型</option>
                                                            <?php if(!empty($goodsType)){foreach($goodsType as $k=>$v){?>
                                                            <option  value="<?=$v['id']?>"><?=$v['type_name']?></option>
                                                            <?php }} ?>
                                                        </select>
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="clearfix"></div>

                                                <div class="form-group m-t-sm" >
                                                    <div class="spec col-xs-8" id="spec" style="padding-left:0;padding-right:0;">
                                                        <table class="table table-bordered">
                                                            <tbody>
                                                                <tr><td colspan="2"><b>商品规格:</b></td></tr>
                                                            </tbody>
                                                        </table>
                                                        <div class="goods_spec_item" id="goods_spec_item">
                                                        </div>
                                                    </div>


                                                    <div class="goods_attribute col-xs-4" id="goods_attribute" style="padding-left:0;padding-right:0;">
                                                        <table class="table table-bordered">
                                                            <tbody>
                                                            <tr><td colspan="2"><b>商品属性:</b></td></tr>
                                                            </tbody>
                                                        </table>
                                                    </div>

                                                </div>
                                            </div>
                                        </div>

                                    <div id="tab-5" class="tab-pane">
                                            <div class="panel-body">
                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="give_integral" class="control-label Validform_label" >赠送积分</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="give_integral" class="form-control" name="give_integral" placeholder="请输入赠送积分" datatype="n" ignore="ignore"  errormsg="赠送积分是数字类型" value="0">
                                                        <div class="help-block"></div>
                                                    </div>
                                                </div>

                                                <div class="form-group ">
                                                    <div class='col-sm-2 text-right'>
                                                        <label for="exchange_integral" class="control-label Validform_label" >积分兑换</label>
                                                    </div>
                                                    <div class='col-sm-10'>
                                                        <input type="text" id="exchange_integral" class="form-control" name="exchange_integral" placeholder="请输入积分兑换" datatype="n" ignore="ignore"  errormsg="积分兑换数字类型" value="0">
                                                        <div class="help-block">如果设置0，则不支持积分抵扣</div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    <div class="box-footer text-center">
                                        <button class="btn btn-primary" type="submit">保存</button>
                                        <span class="btn btn-white" onclick="history.go(-1)">返回</span>
                                    </div>
                                </div>
                                </form>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
{/block}

{block name="js"}

<script src="__STATIC__/admin/plugin/my_uploader/js/uploads.js"></script>
<script type="text/javascript" src="__STATIC__/admin/plugin/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__STATIC__/admin/plugin/ueditor/ueditor.all.js"></script>

<script>
    var ue = UE.getEditor('goods_content');
    var validate = validator('#pt_form');

    $('#select-img').click(function(){
        uploader.open({
            elm:'select-img',//选择图片上传的按钮
            url:"<?=url('common/AjaxController/uploader',['path'=>'goods'])?>",//服务器url
            up_type:1,//上传图片类型1:单图,2:多图
            img_list:'img-list',//存放选择图片之后的容器
            input_name:'original_img',//上传图片表单ID
            img_num:6,//多图上传的总数
            num:2
        });
    });

    $('#select-imgs').click(function(){
        uploader.open({
            elm:'select-img',//选择图片上传的按钮
            url:"<?=url('common/AjaxController/uploader',['path'=>'goods'])?>",//服务器url
            up_type:2,//上传图片类型1:单图,2:多图
            img_list:'img-lists',//存放选择图片之后的容器
            input_name:'photo album',//上传图片表单ID
            img_num:6,//多图上传的总数
            num:2
        });
    });
</script>

<script>
    $('#goods_type').change(function(){
        let type_id = $(this).val();
        let attr_html = '<tr><td colspan="2"><b>商品属性:</b></td></tr>';
        $('#goods_attribute table tbody').html(attr_html);

            $.ajax({
                type:'post',
                url:"<?=url('admin/Goods/getGoodsType')->suffix(false)?>",
                dataType:'json',
                data:{type_id:type_id},
                success:function(res){
                    $('#goods_attribute table tbody').html('');
                    $('#goods_attribute table tbody').html(res.data.attribute);
                    $('#spec table tbody').html('');
                    $('#spec table tbody').html(res.data.spec);

                    //处理商品属性
                    /*
                    let attribute = res.data.attribute;
                    let attr_html = '<tr><td colspan="2"><b>商品属性:</b></td></tr>';
                    $('#goods_attribute table tbody').html(attr_html);
                    if(attribute.length>0){
                        $(attribute).each(function(k,v){
                            attr_html += '<tr>';
                            if(v.attr_input_type == 0){
                                attr_html += '<td style="width:8%">'+v.attr_name+'</td><td><input type="text" class="form-control" name="attr['+v.attr_id+']"></td>';
                            }else if(v.attr_input_type == 2){
                                attr_html += '<td style="width:8%">'+v.attr_name+'</td><td><textarea class="form-control" name="attr['+v.attr_id+']"></textarea></td>';
                            }else{
                                let attr_select = '<select name="attr['+v.attr_id+']" class="form-control">';
                                if(v.attr_values){
                                   for(let i=0;i<v.attr_values.length;i++){
                                       attr_select +='<option value="'+v.attr_values[i]+'">'+v.attr_values[i]+'</option>';
                                   }
                                   attr_select += '</select>';
                                   attr_html += '<td style="width:8%">'+v.attr_name+'</td><td>'+attr_select+'</td>';
                                }
                            }
                            attr_html += '</tr>';
                        });
                        $('#goods_attribute table tbody').html(attr_html);
                    }

                    //处理商品规格并排列组合所有数据生成表格

                    let spec = res.data.spec;
                    let spec_html = '<tr><td colspan="2"><b>商品规格:</b></td></tr>';
                    $('#spec table tbody').html(spec_html);
                    if(spec.length>0){
                        $(spec).each(function(k,v){
                            spec_html += '<tr>';
                            spec_html +='<td style="width: 8%;">'+v.name+'</td>';
                            let spec_item_html = '<td>';
                            if(v.spec_item.length>0){
                                for(let i=0;i<v.spec_item.length;i++){
                                    spec_item_html += '<button type="button" data-spec_id="'+v.spec_id+'" data-item_id="'+v.spec_item[i]['id']+'" class="btn btn-default btn-sm">'+v.spec_item[i]['item']+'</button>&nbsp;&nbsp;&nbsp;';
                                }
                                spec_item_html +='</td>';
                            }
                            spec_html += spec_item_html;
                            spec_html +='</tr>';
                        });
                        $('#spec table tbody').html(spec_html);
                    }
                    */
                },
                error:function(msg){

                }
            });

    });

    //开始排列组合
    $('#spec table tbody').on('click','button',function(){
        let $this = $(this);
        if($(this).hasClass('btn-default')) {
            $(this).removeClass('btn-default').addClass('btn-success');
        }else{
            $(this).removeClass('btn-success').addClass('btn-default');
        }
        let buttons = $('#spec table tbody button');
        let select_spec = [];
        let spec_arr = {};
        $(buttons).each(function(k,v){
            if($(this).hasClass('btn-success')){
                let spec_id = $(this).data('spec_id');
                let spec_item_id = $(this).data('item_id');

                if(!spec_arr.hasOwnProperty(spec_id))
                    spec_arr[spec_id] = [];
                spec_arr[spec_id].push(spec_item_id);
            }
        });

        $.ajax({
            type:'post',
            data:{'spec_arr':spec_arr},
            url:"/index.php/admin/Goods/ajaxGetSpecInput",
            success:function(data){
                //console.log(data);
                $("#goods_spec_item").html('')
                $("#goods_spec_item").append(data);
                hbdyg();  // 合并单元格
            }
        });

    });

    // 合并单元格
    function hbdyg() {
        var tab = document.getElementById("spec_input_tab"); //要合并的tableID
        var maxCol = 2, val, count, start;  //maxCol：合并单元格作用到多少列
        if (tab != null) {
            for (var col = maxCol - 1; col >= 0; col--) {
                count = 1;
                val = "";
                for (var i = 0; i < tab.rows.length; i++) {
                    if (val == tab.rows[i].cells[col].innerHTML) {
                        count++;
                    } else {
                        if (count > 1) { //合并
                            start = i - count;
                            tab.rows[start].cells[col].rowSpan = count;
                            for (var j = start + 1; j < i; j++) {
                                tab.rows[j].cells[col].style.display = "none";
                            }
                            count = 1;
                        }
                        val = tab.rows[i].cells[col].innerHTML;
                    }
                }
                if (count > 1) { //合并，最后几行相同的情况下
                    start = i - count;
                    tab.rows[start].cells[col].rowSpan = count;
                    for (var j = start + 1; j < i; j++) {
                        tab.rows[j].cells[col].style.display = "none";
                    }
                }
            }
        }
    }
</script>

{/block}